/* eslint-disable */
<template>
<div class="rating_page">
     <head-top head-title="培训详细" go-back='true'></head-top>
  <div v-for="(item, index) in task" :key="index">
      <!-- <cell v-if="item.label==='培训材料'" :title="item.label" :link="files" :inline-desc='item.value'></cell> -->
    <div v-if="item.label==='培训材料'">
        <h4>培训材料</h4>
        <template>
            <li v-for="(file, index) in files" :key="index">
                 <a  v-if="type(file.name)==='word'" target="_blank" :href="previewUrl+downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else-if="type(file.name)==='pdf'" target="_blank" :href="downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else-if="type(file.name)==='img'" target="_blank" :href="downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else target="_blank" :href="downloadUrl+file.qkey+'?attname='+encodeURI(encodeURI(file.name))" :v-text="file.name"><span>{{file.name}}</span></a>
            </li>
        </template>
    </div>
      <cell v-else :title="item.label" :value="item.value" primary="content"></cell>
    <!-- <cell :title="item.label" :value="item.value" primary="content" link="attLink"></cell> -->
  </div>
   <x-button v-if="showButton" mini plain type="primary" @click.native="showSum(actual, code)">培训确认</x-button>
   <x-button v-if="showButton" mini plain type="warn" @click.native="showFd(actual, code)">培训反馈</x-button>
   <x-button v-if="showRegButton" mini plain type="primary" @click.native="regInfo(actual)">发起签到验证</x-button>
</div>
</template>
<script>
import { CellFormPreview, Group, Cell, XButton } from "vux";
import headTop from "src/components/head";
import { getAcDetail } from "src/service/actual";
export default {
  name: "taskDetail",
  data() {
    return {
      tabIndex: 0,
      downloadUrl: process.env.downloadUrlQn,
      previewUrl: process.env.previewUrl,
      eventId: "",
      code: "",
      task: [],
      userInfo: null,
      userCode: "",
      actual: {
        id: undefined
      },
      showButton: false,
      showRegButton: false,
      typeOptions: [
        { value: "0", label: "月计划" },
        { value: "1", label: "临时计划" }
      ],
      levelOptions: [
        { value: "0", label: "高" },
        { value: "1", label: "中" },
        { value: "2", label: "低" }
      ],
      formOptions: [
        { value: "理论", label: "理论" },
        { value: "实操", label: "实操" },
        { value: "演练", label: "演练" },
        { value: "技术比武", label: "技术比武" }
      ],
      cateOptions: [
        { value: "0", label: "质量" },
        { value: "1", label: "安全" },
        { value: "2", label: "技术" },
        { value: "3", label: "管理" },
        { value: "4", label: "其他" }
      ],
      hourOptions: [
        { value: "1", label: "1课时" },
        { value: "2", label: "2课时" },
        { value: "3", label: "3课时" },
        { value: "4", label: "4课时" }
      ],
      needSumOptions: [
        { value: "0", label: "否" },
        { value: "1", label: "是" }
      ],
      enableOptions: [
        { value: "0", label: "未完成" },
        { value: "1", label: "已完成" },
        { value: "-1", label: "取消" }
      ],
      attLink: [],
      showFiles: false,
      files: []
    };
  },
  components: {
    headTop,
    CellFormPreview,
    Group,
    Cell,
    XButton
  },
  mounted() {
    this.getDetail();
  },
  created() {
    //   父页面重要参数传递
    this.eventId = this.$route.query.eventId;
    this.userInfo = this.$store.state.user;
    this.tabIndex = this.$route.query.tabIndex;
    // console.log("this.showButton",this.showButton);
    // this.code =  this.userInfo.user_code;
    // console.log("created-userInfo", this.$store.state.user);
    // console.log("created-this.code", this.code);
  },
  methods: {
    getDetail() {
      getAcDetail({
        eventId: this.eventId,
        tabIndex: this.tabIndex
      }).then(response => {
        if (response.status === 200 && response.data.code === 2000) {
            // console.log("this.tabIndex",this.tabIndex);
          this.task = response.data.items;
          // console.log("this.task",this.task);
          //   console.log(this.showButton);
          // console.log("this.userCode",this.userCode);
          // console.log("this.showButton",this.showButton);
          for (const v of this.task) {
            if (v.label === "培训对象") {
              this.userCode = this.userInfo.user_code;
                // console.log("getDetail-this.userCode", this.userCode);
                // console.log("v.value",v.value);
                // console.log("this.tabIndex",this.tabIndex);
                // console.log("v.value.indexOf(this.userCode)",v.value.indexOf(this.userCode)>-1);
                // console.log("this.tabIndex == 0",this.tabIndex == 0);
              if (v.value.indexOf(this.userCode) > -1 && this.tabIndex == 0) {
                     this.showButton = true;
                // console.log("this.showButton",this.showButton);
              }
            }
            if(v.label === "授课人"){
                this.userCode = this.userInfo.user_code;
                if(v.value.indexOf(this.userCode)>-1  && this.tabIndex ==2){
                    this.showRegButton = true;
                }
            }
            if (v.label === "优先级别") {
              if ("0" === v.value) {
                v.value = "高";
              } else if ("1" === v.value) {
                v.value = "中";
              } else if ("2" === v.value) {
                v.value = "低";
              }
            }
            if (v.label === "计划类型") {
              if ("0" === v.value) {
                v.value = "月计划";
              } else if ("1" === v.value) {
                v.value = "临时计划";
              }
            }
            if (v.label === "培训课时") {
              if ("1" === v.value) {
                v.value = "1课时";
              } else if ("2" === v.value) {
                v.value = "2课时";
              } else if ("3" === v.value) {
                v.value = "3课时";
              } else if ("4" === v.value) {
                v.value = "4课时";
              }
            }
            if (v.label === "培训类别") {
              if ("0" === v.value) {
                v.value = "质量";
              } else if ("1" === v.value) {
                v.value = "安全";
              } else if ("2" === v.value) {
                v.value = "技术";
              } else if ("3" === v.value) {
                v.value = "管理";
              } else if ("4" === v.value) {
                v.value = "其他";
              }
            }
            if (v.label === "培训状态") {
              if ("0" === v.value) {
                v.value = "未完成";
              } else if ("1" === v.value) {
                v.value = "已完成";
              } else if ("-1" === v.value) {
                v.value = "取消";
              }
            }
            if (v.label === "培训材料") {
              // console.log(v.value);
              if (v.value != null&&v.value!="") {
                this.files = JSON.parse(v.value);
                //   console.log(this.files);
                var value = [];
                //   console.log(this.files.length);
                for (var i = 0; i < this.files.length; i++) {
                  // console.log(this.files[i]);
                  // this.attLink.push(
                  //   this.downloadUrl +
                  //     this.files[i].qkey +
                  //     "?attname=" +
                  //     encodeURI(encodeURI(this.files[i].name))
                  // );
                  value.push(this.files[i].name);
                }
                //   console.log("this.attLink", this.attLink);
                v.value = value;
              }
            }
          }
          this.actual.id = this.eventId;
          this.code = this.userInfo.user_code;
        //   console.log("getAcDetail-this.code", this.code);
        } else {
          console.log(response);
          this.$notify({
            title: "失败",
            message: response.status + response.data.msg,
            type: "error",
            duration: 2000
          });
        }
      });
    },
    showSum(actual, code) {
      this.$router.push({
        path: "/mhome/sumDetail",
        query: { eventId: actual.id, code: code }
      });
        // console.log("sumDetail");
        // console.log("actual.id", this.actual.id);
    },
    showFd(actual, code) {
      this.$router.push({
        path: "/mhome/fdDetail",
        query: { eventId: actual.id, code: code }
      });
        // console.log("fdDetail");
        // console.log("actual.id", this.actual.id);
    },
    regInfo(actual) {
      this.$router.push({
        path: "/mhome/regList",
        query: { eventId: actual.id }
      });
        // console.log("pullReg");
        // console.log("pullReg-actual.id", this.actual.id);
    },
    // downLoad(files) {
    //   this.$router.push({
    //     path: "/home/attLink",
    //     query: { eventId: files }
    //   });
    //   console.log("downLoad");
    //   console.log("files", this.files);
    // }
    type(name) {
      var array = name.split(".");
      var type = array[1];
      // console.log(type);
      if (type === "docx" || type === "xlsx" || type === "pptx"|| type === "xls" || type === "ppt") {
        return "other";
        // console.log("this.previewUrl",this.previewUrl+this.downloadUrl);
      } else if (type === "doc" ) {
        return "word";
      } else if (
        type === "jpg" ||
        type === "jpeg" ||
        type === "png" ||
        type === "JPG"
      ) {
        return "img";
      } else if (type === "pdf") {
        return "pdf";
      } else {
        return "other";
      }
    }
  }
};
</script>
<style lang="less" scoped>
@import "~vux/src/styles/1px.less";
@import "~vux/src/styles/center.less";
.rating_page {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  overflow: scroll;
}
</style>
